<!doctype html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <title>博客-爆爆社区</title>
    <link rel="stylesheet" th:href="@{/bootstrap/css/bootstrap.min.css}">
</head>
<body style="background: #f2f2f2;">

<div th:replace="common/header::header(activeUrl='blog')"></div>

<main role="main" class="container">
    <div class="row">
        <div class="col-md-9 blog-main">

            <div class="my-3 p-3 bg-white rounded shadow-sm">

                <h6 class="border-bottom border-gray pb-2 mb-0">
                    Q&A 累计：
                    <span th:text="${info.getTotal()}"></span>
                    <span class="float-right" th:if="${!#strings.isEmpty(thisCategoryName)}">
                        <a th:href="@{/blog}">全部</a>
                        /
                        <span th:text="${thisCategoryName}"></span>
                    </span>
                </h6>
                <div th:each="blog:${info.getList()}" class="media text-muted pt-3">
                    <img th:src="${blog.getAuthorAvatar()}" style="border-radius: 5px" width="32" height="32">
                    <p class="media-body pb-3 mb-0 small lh-125 border-bottom border-gray" style="margin-left: 5px">
                        <span style="color:#71716999;background: #ffb700c4"  class="badge badge-danger float-right" th:text="${blog.getAuthorName()}"></span>
                        <!--标题 且根据id号 查询数据 跳转到指定的页面-->
                        <a th:href="@{'/blog/read/'+${blog.getBid()}}" th:text="${blog.getTitle()}"
                           class="text-dark font-weight-bold text-decoration-none d-block"></a>
                    <svg t="1610696420189" class="icon" viewBox="0 0 1024 1024" version="1.1"
                         xmlns="http://www.w3.org/2000/svg" p-id="642" width="16" height="16"><path
                            d="M513.1 187c-324 0-448.7 320-448.7 320s127 327.3 448.7 327.3S961.8 507 961.8 507 837.1 187 513.1 187z m0 522.5c-110.5 0-200.1-89.6-200.1-200.1s89.6-200.1 200.1-200.1 200.1 89.6 200.1 200.1-89.6 200.1-200.1 200.1z"
                            p-id="643"></path><path
                            d="M400.7 508.4c0 40.4 21.5 77.6 56.5 97.8 34.9 20.2 78 20.2 113 0 34.9-20.2 56.5-57.5 56.5-97.8 0-62.4-50.6-113-113-113s-113 50.6-113 113z"
                            p-id="644"></path></svg>
                            <!--浏览量-->
                        [[${blog.getViews()}]]
                    </span>
                        <span th:text="${#dates.format(blog.getGmtUpdate(),'yyyy-MM-dd HH:mm:ss')}"
                        class="badge badge-light float-right" ></span>
                    </p>

                </div>
                <!--分页-->
                <nav aria-label="Page navigation example" class="mt-4">
                    <ul class="pagination justify-content-center pagination-sm">
                        <!--往前翻 如果没有前一页 则禁用-->
                        <li th:class="${info.isHasPreviousPage()==true?'page-item':'page-item disabled'}">
                            <a class="page-link" th:href="@{'/blog?page='+${info.getPrePage()}+'&limit=10'}"
                               tabindex="">Previous</a>
                        </li>

                        <div th:each="page:${info.getNavigatepageNums()}">
                            <li class="page-item" th:classappend="${page}==${info.getPageNum()}?'active':''">
                                <a class="page-link" th:href="@{'/blog?page='+${page}+'&limit=10'}"
                                   th:text="${page}">
                                </a>
                            </li>
                        </div>
                        <li th:class="${info.isHasNextPage()==true?'page-item':'page-item disabled'}">
                            <a class="page-link"
                               th:href="@{'/blog?page='+${info.getNextPage()}+'&limit=10'}">Next</a>
                        </li>
                    </ul>
                </nav>
            </div>
        </div>
        <aside class="col-md-3 blog-sidebar">

            <div class="my-3 rounded">
                <p class="mb-0">
                    <a th:href="@{/blog/write}" class="btn btn-primary btn-sm btn-block"
                       style="color: white">发布博客</a>
                </p>
            </div>

            <div class="p-4 my-3 bg-white rounded">
                <p class="mb-0"> 社区公约: <br> 大家随意水贴 但不要干坏事哟</p>
                <p class="mb-0"> <br> 想新建什么标签可以跟我说</p>
            </div>

            <div class="p-4 my-3 bg-white rounded">
                <!--直接写默认值了 每页10条数据-->
                <a th:href="@{'/blog/category?cid='+${category.getId()}+'&page=1&limit=10'}"
                   th:each="category:${categoryList}" th:text="${category.getCategory()}"
                   class="badge badge-pill badge-primary mr-1"></a>
            </div>

            <div class="p-4 my-3 bg-white rounded">
                <h4 class="font-italic">友情链接</h4>
                <ol class="list-unstyled">
                    <li><a target="_blank" href="https://blog.csdn.net/weixin_44353507?spm=1000.2115.3001.5343">CSDN</a></li>
                    <li><a target="_blank" href="https://space.bilibili.com/85916295">Bilibili</a></li>
                </ol>
            </div>
        </aside>
    </div>
    </div>
</main>
<div th:replace="common/footer::footer"></div>
<a class="to-top">返回顶部</a>
<th:block th:replace="common/footer::script"></th:block>

</body>
</html>